<template>
  <BasicModal v-bind="$attrs" @register="registerModal" title="修改详情" destroyOnClose width="80%" :footer="false">
    <BasicTable @register="registerTable" class="table-box"></BasicTable>
  </BasicModal>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
import { BasicModal, useModalInner } from '@/components/Modal'
import { BasicTable, useTable } from '@/components/Table'

import { getRecordLogsList } from '@/api/sys/operationRecords'
import { modalColumns } from './data'

defineOptions({ name: 'ModalDetail' })

const emit = defineEmits(['success', 'register'])

const recordId = ref()

const [registerModal, { setModalProps }] = useModalInner(async (data) => {
  setModalProps({ confirmLoading: false })
  recordId.value = data.id
})

const [registerTable] = useTable({
  canResize: true,
  api: getRecordLogsList,
  rowKey: 'classifyId',
  columns: modalColumns,
  pagination: false,
  bordered: true,
  striped: false,
  beforeFetch: (params) => {
    return {
      ...params,
      dataRecordId: recordId.value,
    }
  },
})
</script>

<style scoped lang="scss"></style>
